<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>成易博客-博客内容修改</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../static/css/cinui.css"/>
    <link rel="stylesheet" href="../static/layui-v2.6.8/layui/css/layui.css" media="all">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <script src="../static/layui-v2.6.8/layui/layui.js" charset="utf-8"></script>
    <script src="../static/js/jquery-3.6.js"></script>
    <!--  图标库  -->
    <link href="../static/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <!--  富文本  -->
    <script src="https://cdn.jsdelivr.net/npm/wangeditor@latest/dist/wangEditor.min.js"></script>
</head>
<body>

<div class="layui-col-lg4 layui-col-md4 layui-col-sm10 layui-col-xs10 layui-col-md-offset4 layui-col-sm-offset1 layui-col-xs-offset1 formClass"
     style="margin-top: 4%;margin-bottom: 2%;background: white" id="app">
    <form class="layui-form layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-xs12" action="updateBlog" method="post"
          name="form1" style="padding: 12%;">
        <div class="layui-form-item layui-col-lg12  layui-col-md12 layui-col-sm12 layui-col-xs12" style="display: none">
            <label class="layui-form-label">ID</label>
            <div class="layui-input-block">
                <input type="text" id="blogId" name="blogId" required lay-verify="required"
                       autocomplete="off" class="layui-input layui-col-lg12  layui-col-md12 layui-col-sm12 layui-col-xs12"
                       v-model="blogId">
            </div>
        </div>
        <div class="layui-form-item layui-col-lg12  layui-col-md12 layui-col-sm12 layui-col-xs12">
            <label class="layui-form-label">作者</label>
            <div class="layui-input-block">
                <input type="text" id="userName" name="userName" required lay-verify="required"
                       autocomplete="off" class="layui-input layui-col-lg12  layui-col-md12 layui-col-sm12 layui-col-xs12"
                       v-model="userName" disabled>
            </div>
        </div>
        <div class="layui-form-item layui-col-lg12  layui-col-md12 layui-col-sm12 layui-col-xs12">
            <label class="layui-form-label">博客标题</label>
            <div class="layui-input-block">
                <input type="text" id="blogTitle" name="blogTitle" required lay-verify="required"
                       autocomplete="off" class="layui-input layui-col-lg12  layui-col-md12 layui-col-sm12 layui-col-xs12"
                       v-model="blogTitle">
            </div>
            <!--            <div class="layui-form-mid layui-word-aux" id="info1"></div>-->
        </div>
        <div class="layui-form-item layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-xs12">
            <label class="layui-form-label">博客标签</label>
            <div class="layui-input-block">
                <input type="text" id="blogMemo" name="blogMemo" required lay-verify="required"
                       autocomplete="off" class="layui-input layui-col-lg12  layui-col-md12 layui-col-sm12 layui-col-xs12"
                       v-model="blogMemo">
            </div>
            <!--            <div class="layui-form-mid layui-word-aux"></div>-->
        </div>


        <div class="layui-form-item layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-xs12">
            <label class="layui-form-label">博客状态</label>
            <div class="layui-input-block">
                <input type="radio" name="blogStatus" value="公开" title="公开" v-model="blogStatus" checked>
                <input type="radio" name="blogStatus" value="私密" title="私密" v-model="blogStatus">
            </div>
        </div>
        <div class="layui-form-item layui-form-text  layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-xs12">
            <label class="layui-form-label">博客内容</label>
            <div class="layui-input-block">
<!--       富文本 暂停使用         -->
<!--                <div id="div1"></div>-->
<!--                <div id="text-container" class="text"><span>{{blogValue}}</span></div>-->
<!--                <textarea id="blogValue" name="blogValue"-->
<!--                          class="layui-textarea layui-col-lg12  layui-col-md12 layui-col-sm12 layui-col-xs12" style="display: none"></textarea>-->
                <textarea id="blogValue" name="blogValue"
                          class="layui-textarea layui-col-lg12  layui-col-md12 layui-col-sm12 layui-col-xs12"></textarea>
            </div>
        </div>
        <div class="layui-form-item  layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-xs12">
            <div class="layui-input-block">
                <button class="layui-btn layui-btn-normal" id="submit" lay-submit lay-filter="formDemo">修改
                </button>
            </div>
        </div>
    </form>
</div>







<script type="text/javascript" src="../static/js/userInfo.js"></script>

<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
<script src="../static/tinymce/js/tinymce/tinymce.min.js"></script>
<script>
    tinymce.init({
        selector: '#blogValue',
        toolbar: false,
        toolbar: "preview fullscreen",
        language:'zh_CN',//注意大小写
        plugins: "insertdatetime toc preview",
        insertdatetime_formats: ["%H点%M分", "%Y年%m月%d日"],
    });
</script>
<script>
    var sessionBlogId = sessionStorage.getItem('blogId');
    var sessionUserName = sessionStorage.getItem('userName');
    var sessionBlogTitle = sessionStorage.getItem('blogTitle');
    var sessionBlogStatus = sessionStorage.getItem('blogStatus');
    var sessionBlogMemo = sessionStorage.getItem('blogMemo');
    var sessionBlogValue = sessionStorage.getItem('blogValue');
    document.getElementById('blogValue').innerHTML = sessionBlogValue;
    var app = new Vue({
        el: '#app',
        data: {
            blogId: sessionBlogId,
            userName: sessionUserName,
            blogTitle: sessionBlogTitle,
            blogMemo: sessionBlogMemo,
            blogStatus: sessionBlogStatus
        }
    })
</script>

<!--富文本 暂停使用-->
<!-- 引入 wangEditor.min.js -->
<!--<script type="text/javascript">-->
<!--    const E = window.wangEditor;-->
<!--    const editor = new E('#div1','#text-container')-->
<!--    const $text1 = $('#blogValue')-->
<!--    editor.config.onchange = function (html) {-->
<!--        // 第二步，监控变化，同步更新到 textarea-->
<!--        $text1.val(html)-->
<!--    }-->

<!--    // 配置菜单栏，删减菜单，调整顺序-->
<!--    editor.config.menus = [-->
<!--        'bold',-->
<!--        'head',-->
<!--        'fontName',-->
<!--        'justify',-->
<!--        'link',-->
<!--        'italic',-->
<!--        'underline'-->
<!--    ]-->

<!--    editor.create()-->

<!--    // 第一步，初始化 textarea 的值-->
<!--    $text1.val(editor.txt.html())-->
<!--</script>-->




<script>
    layui.use('form', function () {
        var form = layui.form;
        //监听提交  获取表单json数据


        form.on('submit(formDemo)', function (data) {
            return true;
        });
    });
</script>
</body>
</html>